<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Hugo 0.88.1">
    <title>图书信息管理</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/5.1/examples/dashboard/">



    <!-- Bootstrap core CSS -->
    <link th:href="@{/assets/dist/css/bootstrap.min.css}" rel="stylesheet">

    <style>
        .bd-placeholder-img {
            font-size: 1.125rem;
            text-anchor: middle;
            -webkit-user-select: none;
            -moz-user-select: none;
            user-select: none;
        }

        @media (min-width: 768px) {
            .bd-placeholder-img-lg {
                font-size: 3.5rem;
            }
        }
        h3 {
            border-top: 2px solid skyblue;
            border-bottom: 2px solid skyblue;
            height: 50px;
            text-align: center;
            line-height: 50px;
        }

        table {
            margin: 20px auto;
            border-collapse: collapse;
        }

        .a3 th,
        .a4 td {
            width: 230px;
            height: 20px;
            border: 1px solid #e6e6e6;
            padding: 9px 15px;
            font-size: 14px;
            line-height: 20px;
            text-align: left;
        }

        .a3 {
            background-color: rgb(242, 242, 242);
        }

        button {
            height: 30px;
            width: 40px;
            background-color: #ff5722;
            border: none;
            color: #fff;
            border-radius: 2px;
        }

        .a5 a button {
            width: 60px;
            background-color: #009688;
        }

        .a5 td {
            text-align: center;
        }
        .a1{
            position: relative;
        }
        .a1 input{
            position: absolute;
            top: 400px;
            left: 10px;
        }
    </style>


    <!-- Custom styles for this template -->
    <link th:href="@{/css/dashboard1.css}" rel="stylesheet">
</head>
<body>
<header th:replace="layout/layout::dh"></header>
<!--<header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow" >-->
<!--    <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3" href="#">图书管理系统</a>-->
<!--    <button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">-->
<!--        <span class="navbar-toggler-icon"></span>-->
<!--    </button>-->
<!--    <input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">-->
<!--    <div class="navbar-nav">-->
<!--        <div class="nav-item text-nowrap">-->
<!--            <a class="nav-link px-3" href="#">Sign out</a>-->
<!--        </div>-->
<!--    </div>-->
<!--</header >-->

<div class="container-fluid">
    <div class="row">
        <nav th:replace="layout/layout::nav"></nav>
<!--        <nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">-->
<!--            <div class="position-sticky pt-3">-->
<!--                <ul class="nav flex-column">-->
<!--                    <li class="nav-item">-->
<!--                        <a class="nav-link" aria-current="page" th:href="@{/books}">-->
<!--                            <span data-feather="home"></span>-->
<!--                            图书信息-->
<!--                        </a>-->
<!--                    </li>-->
<!--                    <li class="nav-item">-->
<!--                        <a class="nav-link" th:href="@{/entry}">-->
<!--                            <span data-feather="file" ></span>-->
<!--                            书籍录入-->
<!--                        </a>-->
<!--                    </li>-->
<!--                    <li class="nav-item">-->
<!--                        <a class="nav-link" th:href="@{/borrow}">-->
<!--                            <span data-feather="shopping-cart"></span>-->
<!--                            借阅信息-->
<!--                        </a>-->
<!--                    </li>-->
<!--                    <li class="nav-item">-->
<!--                        <a class="nav-link active" th:href="@{/management}">-->
<!--                            <span data-feather="users"></span>-->
<!--                            用户管理-->
<!--                        </a>-->
<!--                    </li>-->
<!--                    <li class="nav-item">-->
<!--                        <a class="nav-link" th:href="@{/user}">-->
<!--                            <span data-feather="bar-chart-2"></span>-->
<!--                            个人信息-->
<!--                        </a>-->
<!--                    </li>-->
<!--                </ul>-->
<!--            </div>-->
<!--            <div class="a1">-->
<!--                <a th:href="@{/logout}"><input type="submit" class="btn btn-primary btn-block" value="登出"></input></a>-->
<!--            </div>-->
<!--        </nav>-->
        <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
            <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                <h1 class="h2">用户管理</h1>
                <div class="btn-toolbar mb-2 mb-md-0">
                    <div class="btn-group me-2">
                        <button type="button" class="btn btn-sm btn-outline-secondary">添加</button>
                        <button type="button" class="btn btn-sm btn-outline-secondary">修改</button>
                    </div>
                    <input type="date" >
                </div>
            </div>


            <h3>查询用户</h3>
            <div class="table-responsive">
            <table class="table table-striped table-sm ">
                <thead>
                <tr  >
                    <th scope="col">ID</th>
                    <th scope="col">用户名</th>
                    <th scope="col">邮箱</th>

                </tr>
                </thead>
                <tbody>

                <tr  th:each="Baccounts:${accounts}">
                    <td th:text="${Baccounts.accountId}"></td>
                    <td th:text="${Baccounts.userName}"></td>
                    <td th:text="${Baccounts.email}"></td>
                </tr>

                </tr>
                <tr class="a4 a5">
                    <td colspan="5">
                        <a href=""><button>上一页</button></a>
                        <span>1/2</span>
                        <a href=""><button>下一页</button></a>
                    </td>
                </tr>
                </tbody>
            </table>
            </div>
        </main>
    </div>
</div>
        </main>
    </div>
</div>


<script th:src="@{/assets/dist/js/bootstrap.bundle.min.js}"></script>

<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js" integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE" crossorigin="anonymous"></script><script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js" integrity="sha384-zNy6FEbO50N+Cg5wap8IKA4M/ZnLJgzc6w2NqACZaK0u0FXfOWRRJOnQtpZun8ha" crossorigin="anonymous"></script><script th:src="@{/js/dashboard.js}"></script>
</body>
</html>